<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="../../../views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>预约号源管理</title>
<head>
<meta charset="utf-8">
<title>预约号源管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">

<link rel="stylesheet"
	href="/fdoctor-ms/statics/beginnerAdmin/plugins/layui/css/layui.css"
	media="all" />
<link rel="stylesheet"
	href="/fdoctor-ms/statics/beginnerAdmin/plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet"
	href="/fdoctor-ms/statics/beginnerAdmin/css/btable.css" />
<link rel="stylesheet"
	href="/fdoctor-ms/statics/easyui/css/bootstrap/easyui.css" />
<link rel="stylesheet"
	href="/fdoctor-ms/statics/easyui/css/icon.css" />


<script type="text/javascript"
	src="/fdoctor-ms/statics/beginnerAdmin/plugins/layui/layui.js"></script>
<script type="text/javascript"
	src="/fdoctor-ms/statics/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript"
	src="/fdoctor-ms/statics/easyui/js/jquery.easyui.min.js"></script>

</head>

<body style="background-color: gainsboro;">

	<div style="margin: 0px; background-color: white;">
		<blockquote class="layui-elem-quote">
			<form class="layui-form" action="">
				<div class="layui-form-item" align="left"
					style="margin-left: 0px; margin-top: 10px;">
					<div class="layui-inline" style="width: 25%;">
						<label class="layui-form-label" style="width: 70px">选择医院</label>
						<div class="layui-input-inline">
							<select name="orgId" id="orgId" lay-search>
								<option value="">可输入医院名搜索</option>
								<c:forEach items="${hospitalList}" var="hospitalItem">
									<option value="${hospitalItem.id}">${hospitalItem.orgName}</option>
								</c:forEach>
							</select>
						</div>
					</div>
					
					<div class="layui-inline">
						<div class="layui-input-inline">
							<button class="layui-btn layui-btn-primary layui-btn-small"><i class="layui-icon">&#xe603;</i></button>
						</div>
					</div>
					<div class="layui-inline">
						<div class="layui-input-inline">
							<span>5月</span>
						</div>
					</div>
					<div class="layui-inline">
						<div class="layui-input-inline">
							<button class="layui-btn layui-btn-primary layui-btn-small"><i class="layui-icon">&#xe602;</i></button>
						</div>
					</div>
						
					
					<div class="layui-inline" style="width: 20%;">
						<div class="layui-input-inline">
							<button class="layui-btn layui-btn-radius" style="width: 100%"
								id="selectButton" type="button">查询</button>
						</div>
					</div>

				</div>
			</form>
		</blockquote>
		<div id="content" style="width: 100%; height: 100%;">
			<table id="dg" class="easyui-datagrid" style="width:100%;height:500px"
					data-options="
						iconCls: 'icon-save',
						url: '/fdoctor-ms/statics/easyui/datagrid_data1.json',
						method: 'get',
						onLoadSuccess: onLoadSuccess,
						singleSelect: true,
						onClickCell: onClickCell
					">
				<thead>
					<tr>
						<th data-options="field:'monthNum', align:'center',width:'9%'">日期</th>
						<th data-options="field:'beginDate',align:'center',width:'9%'">开始日期</th>
						<th data-options="field:'endDate',align:'center',width:'9%'">结束日期</th>
						<th data-options="field:'clinicTime',align:'center',width:'9%'">时段</th>
						<th data-options="field:'monday',align:'center',width:'9%',editor:'numberbox'">周一</th>
						<th data-options="field:'tuesday',align:'center',width:'9%',editor:'numberbox'">周二</th>
						<th data-options="field:'wednesday',align:'center',width:'9%',editor:'numberbox'">周三</th>
						<th data-options="field:'thursday',align:'center',width:'9%',editor:'numberbox'">周四</th>
						<th data-options="field:'friday',align:'center',width:'9%',editor:'numberbox'">周五</th>
						<th data-options="field:'saturday',align:'center',width:'9%',editor:'numberbox'">周六</th>
						<th data-options="field:'sunday',align:'center',width:'9%',editor:'numberbox'">周日</th>
					</tr>
				</thead>
			</table>
		</div>
	</div>

	<script>
	function tableConfig(){
		layui.config({
            base: '/fdoctor-ms/statics/beginnerAdmin/js/'
        }).use(['btable','layer'], function () {
            var layer = layui.layer;
            
            var btable = layui.btable(),
                $ = layui.jquery;
            
            //layer.config({
            	//id : Math.ceil(100)	//防止重复弹窗
            //});

            $(window).on('resize', function (e) {
                var $that = $(this);
                $('#content').height($that.height() - 92);
            }).resize();
            
        });
	}

    //初始化表单控件
	layui.use(['jquery', 'form'], function() {
	     $ = layui.jquery;
	     form = layui.form();
	     $form = $('form');
	});
    
	function onLoadSuccess(data){
		var merges = [{
			index: 0,
			rowspan: 2
		},{
			index: 2,
			rowspan: 2
		},{
			index: 4,
			rowspan: 2
		},{
			index: 6,
			rowspan: 2
		},{
			index: 8,
			rowspan: 2
		}];
		for(var i=0; i<merges.length; i++){
			$(this).datagrid('mergeCells',{
				index: merges[i].index,
				field: 'monthNum',
				rowspan: merges[i].rowspan
			});
			
			$(this).datagrid('mergeCells',{
				index: merges[i].index,
				field: 'beginDate',
				rowspan: merges[i].rowspan
			});
			
			$(this).datagrid('mergeCells',{
				index: merges[i].index,
				field: 'endDate',
				rowspan: merges[i].rowspan
			});
		}
	}
	
	$.extend($.fn.datagrid.methods, {
		editCell: function(jq,param){
			return jq.each(function(){
				var opts = $(this).datagrid('options');
				var fields = $(this).datagrid('getColumnFields',true).concat($(this).datagrid('getColumnFields'));
				for(var i=0; i<fields.length; i++){
					var col = $(this).datagrid('getColumnOption', fields[i]);
					col.editor1 = col.editor;
					if (fields[i] != param.field){
						col.editor = null;
					}
				}
				$(this).datagrid('beginEdit', param.index);
				for(var i=0; i<fields.length; i++){
					var col = $(this).datagrid('getColumnOption', fields[i]);
					col.editor = col.editor1;
				}
			});
		}
	});
	
	var editIndex = undefined;
	function endEditing(){
		if (editIndex == undefined){return true}
		if ($('#dg').datagrid('validateRow', editIndex)){
			$('#dg').datagrid('endEdit', editIndex);
			editIndex = undefined;
			return true;
		} else {
			return false;
		}
	}
	function onClickCell(index, field){
		if (endEditing()){
			$('#dg').datagrid('selectRow', index)
					.datagrid('editCell', {index:index,field:field});
			editIndex = index;
		}
		
		var merges = [{
			index: 0,
			rowspan: 2
		},{
			index: 2,
			rowspan: 2
		},{
			index: 4,
			rowspan: 2
		},{
			index: 6,
			rowspan: 2
		},{
			index: 8,
			rowspan: 2
		}];
		for(var i=0; i<merges.length; i++){
			$(this).datagrid('mergeCells',{
				index: merges[i].index,
				field: 'monthNum',
				rowspan: merges[i].rowspan
			});
			
			$(this).datagrid('mergeCells',{
				index: merges[i].index,
				field: 'beginDate',
				rowspan: merges[i].rowspan
			});
			
			$(this).datagrid('mergeCells',{
				index: merges[i].index,
				field: 'endDate',
				rowspan: merges[i].rowspan
			});
		}
	}
	
	</script>
</body>
</html>